<!-- BEGIN: main -->
<script src="{NV_BASE_SITEURL}themes/{TEMPLATE}/js/jquery.etalage.min.js"></script>
	<link rel="stylesheet" href="{NV_BASE_SITEURL}themes/{TEMPLATE}/css/etalage.css">	
		<script>
			jQuery(document).ready(function($){
				$('#etalage').etalage({
					thumb_image_width: 300,
					thumb_image_height: 200,
					source_image_width: 900,
					source_image_height: 900,
					show_hint: true,
					click_callback: function(image_anchor, instance_id){
						alert('Callback example:\nYou clicked on an image with the anchor: "'+image_anchor+'"\n(in Etalage instance: "'+instance_id+'")');
					}
				});


				// This is for the dropdown list example:
				$('.dropdownlist').change(function(){
					etalage_show( $(this).find('option:selected').attr('class') );
				});
			});
		</script>

    <section id="product">
        <div class="container"> 
			<span class="image-demo">
				<ul id="etalage">
					<li>
						<a href="optionallink.html">
							<img class="etalage_thumb_image" src="{SRC_PRO_LAGE}" />
							<img class="etalage_source_image" src="{SRC_PRO_LAGE}" title="{TITLE}" />
						</a>
					</li>
			
				<!-- BEGIN: othersimg -->		
					<li>	

						<img class="etalage_thumb_image" src="{IMG_SRC_OTHER}" />
						<img class="etalage_source_image" src="{IMG_SRC_OTHER}" title="{TITLE}" />
				
					</li>
				<!-- END: othersimg -->
				</ul>
		
			
				
			</span>
		 <div class="span5">
                    <div class="row">
                        <div class="span5">
							 <h1 class="productname"><span class="bgnone">{TITLE}</span></h1>
								<span class="date_up dong">{DATE_UP} - {NUM_VIEW} {LANG.detail_num_view}</span>
									
									<!-- BEGIN: price -->
									
									<div class="productprice">
									<!-- BEGIN: discounts -->
						<div class="productpageprice" style="width:300px;"><span class="bgnone">{product_discounts} {money_unit}</span></div>
									<!-- END: discounts -->
                                <div class="{class_money}" style="width:300px;"> <span class="spiral"></span>{product_price} {money_unit}</div>
                                										
	 
                              <!-- BEGIN: allowed_rating -->
			<p style="padding:6px 0; border-bottom:1px dotted #000000; color:#006699">
				<span>{LANG.detail_rank} : <span class="math_rate">{RATE}</span> {LANG.detail_rate_math}</span>
				<span class="div_rate">
					<a href="#" class="rate icon-star"></a>
					<a href="#" class="rate icon-star"></a>
					<a href="#" class="rate icon-star"></a>
					<a href="#" class="rate icon-star"></a>
					<a href="#" class="rate icon-star"></a>
									</span>
			<p>
			<!-- END: allowed_rating -->
                            </div>
<!-- END: price -->
	<ul class="productinfo">
			<!-- BEGIN: product_code -->
			 <li> <span class="productinfoleft"><i class="icon-barcode icon-1x"></i> {LANG.product_code}</span>:{PRODUCT_CODE}
										</li>
									<!-- END: product_code -->
	
			<!-- BEGIN: contact --><span class="dong">
			{LANG.detail_pro_price}: <span class="money">{LANG.price_contact}</span></span><br>
			<!-- END: contact -->
			<!-- BEGIN: source -->
				   <li> <span class="productinfoleft"><a href="{link_source}"><i class="icon-user icon-1x"> </i> {LANG.detail_source}</span> :{source}</a></li>
			<!-- END: source -->
			
			<!-- BEGIN: promotional -->
				  <li> <span class="productinfoleft"><a href="#"><i class="icon-gift icon-1x"> </i> {LANG.detail_promotional}</span> : {promotional}</a></li>
			<!-- END: promotional -->
			
			<!-- BEGIN: warranty -->
				  <li> <span class="productinfoleft"><a href="#"><i class="icon-ok icon-1x"> </i> {LANG.detail_warranty}</span> : {warranty}</a></li>
			<!-- END: warranty -->
			
			<!-- BEGIN: address -->
				  <li> <span class="productinfoleft"><a href="#"><i class="icon-location-arrow icon-1x"> </i> {LANG.detail_product_address}</span> : {address}</a></li>
			<!-- END: address -->
			
			<!-- BEGIN: note -->
				  <li> <span class="productinfoleft"><a href="#"><i class="icon-file-text icon-1x"></i> {LANG.cart_note}</span> : {note}</a></li>
			<!-- END: note -->

				<!-- BEGIN: hometext -->
			<span class="dong1" style="color:#000;	font-weight:normal;font-size: 12px;">
				{hometext}
			</span> <br>
			<!-- END: hometext -->
		</ul>
				<!-- BEGIN: adminlink -->
					<div class="fl">{ADMINLINK}</div>
					<!-- END: adminlink -->
			
			<div class="clearfix fl" style="width:470px; padding:6px 0px">
				<strong class="fl">{LANG.detail_share} : </strong>
				<span class="share clearfix">
					<!-- BEGIN: allowed_print -->
					<a rel="nofollow" href="{LINK_PRINT}" title="print" id="click_print">
		<button class="btn btn-success" style="line-height:2px;" data-original-title="Cart" style="margin-top:-10px;"> 
		<i class="icon-print"></i> print </button>
					</a><!-- END: allowed_print -->
					<a onclick="share_facebook();" href="javascript:;" title="Share on Facebook">
						<button class="btn btn-success" style="line-height:2px;" data-original-title="Cart" style="margin-top:-10px;">
						<i class="icon-facebook"></i> Facebook </button>
					</a>
					<a onclick="share_twitter();" href="javascript:;" title="Share on Twitter">
						<button class="btn btn-success" style="line-height:2px;" data-original-title="Cart" style="margin-top:-10px;">
						<i class="icon-twitter"></i> Twitter </button>
					</a>
					<a onclick="share_google();" href="javascript:;" title="Share on Google">
					<button class="btn btn-success" style="line-height:2px;" data-original-title="Cart" style="margin-top:-10px;">
						<i class="icon-google-plus"></i> Google +</button>
					</a>
					<a onclick="share_buzz();" href="javascript:;" title="Share on Buzz">
						<i class="icon-buzz"></i>
					</a>
				</span>
			</div>
		  <!-- BEGIN: order -->
			<div class="clearfix fr" style="width:370px;">
				<input type="text" name="num" value="1" class="span1" id="pnum">
				<a href="javascript:void(0)" id="{proid}" title="{title_pro}" onclick="cartorder_detail(this)">
				<button class="btn btn-orange tooltip-test" data-original-title="Cart" style="margin-top:-10px;"> 
				<i class="icon-shopping-cart icon-white"></i>  {LANG.add_product}</button>
				</a>
			</div>
			<!-- END: order -->
	</div>
	</div>
</div>	
			
		
		</div>
		<div style="clear:both"></div>
		<div style="detail_com">
			<!-- BEGIN: shop -->
			{LANG.company_product} : <a href="{link_shop}" title="{title_shop}">{title_shop}</a> 
			<!-- END: shop -->
		</div>
		<!-- Product Description tab & comments-->
                            <div class="productdesc">
                                <ul class="nav nav-tabs" id="myTab">
                                    <li class="active"><a href="#detail">{LANG.product_detail}</a> </li>
                                    <li><a href="#comments">
									<!-- BEGIN: comment_tab -->
									{LANG.detail_comments}
									<!-- END: comment_tab --></a> </li>
									  <li><a href="#faceb">{LANG.detail_comments} Facebook 
									  (<fb:comments-count href={NV_BASE_SITEURL}{link_f}></fb:comments-count>)
									  </a> </li>
                                    <li><a href="#spcungloai">{LANG.detail_others}</a> </li>
									<li><a href="#spvuaxem">{LANG.detail_others_view}</a> </li>
                                   
                                </ul>
                                <div class="tab-content">
                                    <div class="tab-pane active" id="detail">
                                        {DETAIL}
                                    </div>
                                    <div class="tab-pane " id="comments">
                                       <!-- BEGIN: comment -->
				<div class="Page">
					<div class="prd_rate">
					<div id="showcomment">{COMMENTCONTENT}</div>
						<!-- BEGIN: form -->
						<form class="comment" action="" onsubmit="return false;">
								<input type="hidden" value="{proid}" name="proid" id="proid" />
									<fieldset>
										<span id="charlimitinfo">{LANG.comment_limit_characters}</span>
											<textarea id="commentcontent" rows="5" name="commentcontent" style="width:90%"></textarea>
												<div class="fl clearfix">
													<label for="captcha">
															{LANG.comment_capcha}
													</label>
														<img height="20" name="vimg" src="{NV_BASE_SITEURL}?scaptcha=captcha" title="{LANG.captcha}" alt="{LANG.captcha}" id="vimg" />
														<input type="text" maxlength="{NV_GFX_NUM}" value="" id="commentseccode_iavim" name="fcode" style="width:60px"/>
														<input type="button" value="Reset" class="btn btn-orange" onclick="nv_change_captcha('vimg','commentseccode_iavim');" style="margin-top:-10px" />
												</div>
										<div>
											<input onclick="sendcommment('{proid}','{COMMENT_CHECKSESS}','{NV_GFX_NUM}')" type="button" value="{LANG.comment_send}" id="buttoncontent" class="btn btn-orange"/>
										</div>
									</fieldset>
						</form>
						<!-- END: form -->
						<!-- BEGIN: form_login -->
						<p>{COMMENT_LOGIN}</p>
						<!-- END: form_login -->
						
					</div>
				</div>
				<!-- END: comment -->
                                    </div>
							<div class="tab-pane" id="faceb">
							<div class="fb-comments" data-href="{NV_BASE_SITEURL}{link_f}" data-width="600"></div>
							</div>
							<div class="tab-pane" id="spcungloai">
							 <!-- BEGIN: other -->
											{OTHER}   
											<!-- END: other -->
											</div>
							 	<div class="tab-pane" id="spvuaxem">
								  <!-- BEGIN: other_view -->
							{OTHER_VIEW} 
								<!-- END: other_view -->
								</div>
                            </div>
							 </div>
				</section>
<div class="msgshow" id="msgshow"></div>
<script type="text/javascript">
	$(function(){
		<!-- BEGIN: allowed_print_js -->
		$('#click_print').click(function(event){
			var href = $(this).attr("href");
			event.preventDefault();
			NewWindow(href, '', '640', '500', 'yes');
			return false;
		});
		<!-- END: allowed_print_js -->
		<!-- BEGIN: allowed_rating_js -->
		$("a.rate").click(function(event){
			event.preventDefault();
			var val = $(this).html();
			$.ajax({
				type: "POST",
				url: '{LINK_RATE}'+'&nocache=' + new Date().getTime(),
				data: 'val=' + val,
				success: function(data){
					var s = data.split('_');
					alert(s[1]);
				}
			});
			return false;
		});
		<!-- END: allowed_rating_js -->
	});
</script>
<!-- END: main -->